<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="./lib/mui/css/mui.css">
    <link rel="stylesheet" href="./css/details.css">
    <script src="./lib/jquery/jquery.js"></script>
    <script src="./lib/mui/js/mui.js"></script>
    <script src="./lib/jquery/art-template.js"></script>
    <script src="./js/details.js"></script>
</head>

<body>
    <div class="da">
        <a href="./index-one.html"> <span class="da-left mui-icon mui-icon-back" id="fanhui">返回</span>
        </a>
        <span class="da-right">团购详情</span>
    </div>
    <div id="slider" class="mui-slider">
        <div class="mui-slider-group mui-slider-loop">
            <!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
            <div class="mui-slider-item mui-slider-item-duplicate">
                <a href="#">
                    <img src="./images/yuantiao.jpg">
                </a>
            </div>
            <!-- 第一张 -->
            <div class="mui-slider-item">
                <a href="#">
                    <img src="./images/shuijiao.jpg">
                </a>
            </div>
            <!-- 第二张 -->
            <div class="mui-slider-item">
                <a href="#">
                    <img src="./images/muwu.jpg">
                </a>
            </div>
            <!-- 第三张 -->
            <!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
            <div class="mui-slider-item mui-slider-item-duplicate">
                <a href="#">
                    <img src="./images/shuijiao.jpg">
                </a>
            </div>
        </div>
        <div class="mui-slider-indicator">
            <div class="mui-indicator mui-active"></div>
            <div class="mui-indicator"></div>
            <div class="mui-indicator"></div>
            <div class="mui-indicator"></div>
        </div>
    </div>
    <div class="big">
        <div class="jia">

        </div>

        <!-- 价钱 -->

    </div>



    <ul class="mui-table-view">
        <li class="mui-table-view-cell mui-icon mui-icon-info">团购详情</li>
        <li class="mui-table-view-cell">石烧烤五花肉拌饭2选1（不可重复选）</li>
        <li class="mui-table-view-cell">五花肉石锅拌饭</li>
        <li class="mui-table-view-cell">石烧烤五花肉石锅拌饭</li>
        <li class="mui-table-view-cell">
            开胃前菜&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;两碟（免费续加）&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2元
        </li>
    </ul>
    <div class="wode">团购价18元</div>
    <!-- 模板引擎 -->
    <script type="text/html" id="tpl-one">
        <p>{{shop_name}}</p>
        <p>{{shop_name_sub}}</p>

        <div class="splice">
            <span class="shiba">
                <p>￥{{price_current}}</p>
            </span>
            <span class="sanshi"><s>￥{{price_old}}</s></span>
            <button type="button" class="mui-btn mui-sin">App专享</button>
            <button type="button" class="mui-btn mui-btn-danger mui-son">立即购买</button>
        </div>

        <div class="tui">
            <div class="tui-left mui-icon mui-icon-navigate">{{advantage[0]}}</div>
            <div class="tui-right mui-icon mui-icon-reload">{{advantage[1]}}</div>
        </div>
    </script>







    <script type="text/javascript" charset="utf-8">
        mui.init({
            swipeBack: true //启用右滑关闭功能
        });
        var slider = mui("#slider");
        slider.slider({
            interval: 0
        });
    </script>
</body>

</html>